<template>

    <div class="fr offcn19_xqright">
        <div class="offcn19_kcsp ">
            <div class="offcn19_spbox">
                <img :src="imgSrc" alt="" style="height: 196px;width: 350px;">
            </div>
            <p class="offcn19_price">
                <i class="zgmoreone" more="1.00"><i>￥</i>
                    {{curPrice}} </i> <span>原价￥{{oriPrice}}</span>
            </p>
            <div class="offcn19_bmnum clearfix">
                {{saleCount}}人已报名
                <em id="offcn19_bmnum">
                </em>
                <a class="fr offcn19_starb " id="house" data-id="">收藏
                </a>
                <div class="offcn19_share fr">
                    <span>分享</span>
                    <div class="lh_sildewm">
                        <span class="lh_sanjiao"></span>
                        <p id="qrcodeCanvas"><canvas width="135" height="135"></canvas></p>
                        <p>打开微信，点击发现<br>使用扫一扫分享</p>
                    </div>
                </div>
            </div>

            <p class="offcn19_ccouple"></p>

            <div id="woyaobaoming" v-show="showBuy">
                <a class="offcn19_signbtn offcn19_fenleibtn Q-directbuy-btn" @click="buyCourse"  >我要报名</a>
            </div>
            <a v-show="showBuy" class="offcn19_signbtn offcn19_fenleibtn Q-buy-btn" >加入购物车</a>
            <div class="offcn19_zxbtn">
                <a href="javascript:void(0);" class="offcn19_zxtel">电话咨询</a>
                <a href="javascript:void(0);" target="_blank">在线咨询</a>
            </div>
            <div class="offcn19_plat">本课程支持以下设备缓存听课
                <div class="offcn19_plats">
                    <span class="offcn19_plat1"></span>
                    <div>
                        <em></em>
                        <img src="public/it/images/ujyx_26.jpg" alt="">
                    </div>
                </div>
                <div class="offcn19_plats">
                    <span class="offcn19_plat2"></span>
                    <div>
                        <em></em>
                        <img src="public/it/images/ujyx_26.jpg" alt="">
                    </div>
                </div>
                <div class="offcn19_plats">
                    <span class="offcn19_plat3"></span>
                    <div>
                        <em></em>
                        <img src="public/it/images/ujyx_26.jpg" alt="">
                    </div>
                </div>
            </div>
        </div>

    </div>
</template>
<script>

    export default {
        name:'DetailRight',
        props:{
            imgSrc:'',
            price:0,
            originalPrice:0,
            saleCount:0,
            showBuy:true
        },
        data:function () {
            return {}
        },
        computed:{
            curPrice:function () {
                return (this.price/100).toFixed(2)
            },
            oriPrice:function () {
                return (this.originalPrice/100).toFixed(2)
            }
        },
        methods:{
            buyCourse:function () {
                this.$emit('buyCourse')
            }
        }
    }

</script>
<style>
    .offcn19_signbtn{ display:block;   border-radius: 3px;height: 48px;background-image: linear-gradient( 43deg, rgb(243,48,47) 0%, rgb(255,105,53) 100%); background-image: -ms-linear-gradient( 43deg, rgb(243,48,47) 0%, rgb(255,105,53) 100%);filter:progid:DXImageTransform.Microsoft.Gradient(gradientType=1,startColorStr=#f3302f,endColorStr=#ff6935); font-size: 16px; line-height: 48px; color:#fff; text-align:center;}
    .Q-buy-btn {
        background: #65acff;
        margin-top: 8px;
    }
</style>